<script setup>

import moduleJson from "@/components/page/moduleJson"
import dataJson from "@/components/page/dataJson"
import {inject, nextTick, onMounted, reactive, ref, toRaw, toRefs, unref} from "vue";
import {CloseBold, Delete, EditPen, Plus} from "@element-plus/icons-vue";
import KnowledgeService from "@/service/impl/KnowledgeService.js";
import KnowledgeTitleModel from "@/model/KnowledgeTitleModel.js";
import KnowledgeInfoModel from "@/model/KnowledgeInfoModel.js";
import FileUpload from "@/components/FileUpload.vue";


const t = inject('$t')
const message = inject('message')
const data = dataJson()
const module = moduleJson()
const knowledgeTitleModel = ref(new KnowledgeTitleModel())
const knowledgeInfoModel = ref(new KnowledgeInfoModel())
const pageTable = ref()
const loading = ref(false)
const titleList = ref([])


const init = () => {
    module.value.dialog.show = false
    KnowledgeService.titleList({}).then(res => {
        titleList.value = res.data
    })
}
const editOpen = () => {
    const fun = {
        0: () => {
            module.value.dialog.title = '添加'
            knowledgeTitleModel.value = new KnowledgeTitleModel()
        },
        1: () => {
            module.value.dialog.title = '编辑'
            let obj = titleList.value.find(item => item.id === knowledgeTitleModel.value.id)
            knowledgeTitleModel.value = JSON.parse(JSON.stringify(obj))
        }
    }
    knowledgeTitleModel.value?.id ?  fun[1](init) : fun[0](init)
    module.value.dialog.show = true
    module.value.dialog.load = false
}
const editConfirm = () => {
    KnowledgeService.titleEdit(knowledgeTitleModel.value).then(res => {
        init();
    }).catch(e => {

    })
}
const delConfirm = () => {
    if(!knowledgeTitleModel.value?.id){
        message.warning("请选择知识库")
        return
    }
    KnowledgeService.titleDel(knowledgeTitleModel.value).then(res => {
        init()
        message.success("删除成功")
        knowledgeTitleModel.value = new KnowledgeTitleModel()
        infoList(null)
    })
}


const infoList = (val) => {
    data.value.data.knowledgeTitleId = val
    KnowledgeService.infoList(data.value.source()).then(res => {
        data.value.init(res)
        loading.value = false
    }).catch(e => loading.value = false)
}

const delInfo = (obj) => {
    KnowledgeService.infoDel(obj).then(res => {
        message.success("删除成功")
        infoList(knowledgeTitleModel.value.id)
    })
}


const onRefresh = () => {
    init()
    infoList(knowledgeTitleModel.value.id)
}

onMounted(() => {
    module.value.init(null, null,
        KnowledgeService.url.titleDel, null, null)
    module.value.operations.width = "200px"
    module.value.dialog.width = "40%"
    init()
})

</script>
<template>
    <Page
        @refresh="onRefresh"
        :data="data"
        :module="module"
        @edit-confirm="editConfirm"
        @del-confirm="delInfo"
        ref="pageTable"
    >
        <template #table>

        </template>
        <template #table-left>
        </template>
        <template #operate-before>
            <el-button type="primary" :icon="knowledgeTitleModel.id?EditPen:Plus" style="margin-left: 12px" @click="editOpen">
                {{knowledgeTitleModel.id?'编辑':'添加'}}
            </el-button>
            <el-select v-model="knowledgeTitleModel.id" clearable  style="width: 200px;margin:0 15px 0 15px"
                       @change="infoList">
                <el-option
                    v-for="item in titleList"
                    :key="item.id"
                    :label="item.title"
                    :value="item.id"
                />
            </el-select>
            <el-popconfirm title="确认要删除吗?" @confirm="delConfirm">
                <template #reference>
                    <el-button type="danger" :icon="Delete">
                        删除
                    </el-button>
                </template>
            </el-popconfirm>
        </template>
        <template #operate-after>
            <file-upload @on-call="onRefresh" :method="'knowledgeInfo'" :data="{
                knowledgeTitleId: knowledgeTitleModel.id
            }" :description="{
                title: '上传文件',
                single: '单个上传',
                batch: '批量上传',
                prompt: '文件'
            }" :tag="{
                id: knowledgeTitleModel.id,
                path: 'knowledge',
            }" />
        </template>
        <template #table-column>
            <el-table-column prop="name" label="文件名称" />
            <el-table-column prop="createTime" :label="$t('btn.createTime')" />
        </template>
        <template #after-table-event="row">
        </template>
        <template #table-dialog>
            <el-form :rules="knowledgeTitleModel.rules" :label-width="110" :label-position="'left'"
                     :model="knowledgeTitleModel" style="width: 100%;padding: 5px">
                <el-form-item label="知识库名称" prop="title">
                    <el-input v-model="knowledgeTitleModel.title" autocomplete="off"/>
                </el-form-item>
                <el-form-item label="参数设置" prop="imageWidth">

                </el-form-item>
            </el-form>
        </template>
        <template #table-search>

        </template>

    </Page>

</template>

<style lang="scss" scoped>

</style>
